<template>
  <div class="home">
    <myHeader></myHeader>
    <div class="home-center">
      <div class="home-center-row">
        <div>
          <!--背景图-->
        </div>
        <div class="home-center-row-login-todo">
          <p class="title">用户登录</p>
          <div class="content">
            <p><input type="text" v-model="mobile" placeholder="请输入手机号" @keyup="toLogin($event)" />
              <!--<label><img src="../../assets/img/login/iPhone.png" alt=""></label>-->
            </p>
            <p><input type="password" v-model="password" placeholder="请输入密码" @keyup="toLogin($event)" />
              <p><label class="remberPwd"><input type="checkbox" v-model="isRemberPwd">记住密码</label><span></span></p>
              <!--<label><img src="../../assets/img/login/password.png" alt=""></label></p>-->
              <p><input type="button" @click="login" value="登 录" /></p>
              <!--<p><input type="checkbox"><label>记住密码？</label></p>-->
          </div>
        </div>
      </div>
      <p class="home-center-bottom-title"> 成都墨提斯科技有限公司版权所有</p>
    </div>
  </div>
</template>

<script>
  import {
    mapState,
    mapMutations,
    mapActions
  } from 'vuex';
  import myHeader from '../common/header'
  import 'regenerator-runtime/runtime'
  import {
    loginHandle,
    signLoginHandle
  } from '../../service/api'
  import cookie from '../../utils/cookie.js'

  export default {
    name: 'login',
    components: {
      myHeader
    },
    data() {
      return {
        mobile: "", // 手机号
        password: "", // 密码
        isRemberPwd: false, // 是否记住密码
        popup: false,
        treeData: [],
        defaultProps: {
          children: '_child',
          label: 'BMMC',
          value: "BMBM"
        },
        checkedDepartment: ""
      }
    },
    mounted() {
      let nameAndPwd = JSON.parse(cookie.getCookie('nameAndPwd'));
      if (nameAndPwd) {
        this.mobile = nameAndPwd.mobile;
        this.password = nameAndPwd.password;
        this.isRemberPwd = true;
      } else {
        this.mobile = '';
        this.password = '';
        this.isRemberPwd = false;
      }
      if (this.$route.query.timestamp && this.$route.query.mobile && this.$route.query.signature, this.$route.query.department) {
        localStorage.setItem('department', this.$route.query.department)
        this.signLogin()
      }
    },
    methods: {
      /*catch store.mutation*/
      ...mapMutations(['setName', 'setAuthority', 'saveDepartment']),
      /*catch store.action*/
      ...mapActions(['SAVE_USERINFO', 'SET_AUTHORITY', 'SAVE_OPTIONS']),
      async login() {

        // 开发UI周期的临时无条件登录
        this.$router.push({
            path: "/home"
        });
        return false;


        let userInfo = [{},
          [],
          []
        ];
        this.SAVE_USERINFO(userInfo);
        if (!this.mobile || !this.password) {
          this.$utils.openMessgeTip("用户名或密码不能为空", '提示')
          return;
        } else if (!(/^1[34578]\d{9}$/.test(this.mobile))) {
          this.$utils.openMessgeTip("请输入正确手机号", '提示')
          return;
        }
        const {
          code,
          data,
          message
        } = await loginHandle(this.mobile, this.password);
        if (code == 200) {
          this.SAVE_USERINFO(data);
          this.popup = true;
          this.treeData = data[2];
          if (this.isRemberPwd) {
            let nameAndPwd = {
              mobile: this.mobile,
              password: this.password
            }
            cookie.setCookie("nameAndPwd", JSON.stringify(nameAndPwd), 7)
          } else {
            cookie.setCookie("nameAndPwd", null, 7)
          }
          this.$router.push({
            path: "/home"
          })
        } else {
          this.$utils.openMessgeTip(message, '提示')
        }
      },
      async signLogin() {
        const {
          code,
          data,
          message
        } = await signLoginHandle(this.$route.query.timestamp, this.$route.query.mobile, this.$route.query.signature);
        if (code == 200) {
          this.SAVE_USERINFO(data);
          this.$router.push({
            path: '/home'
          });
        } else {
          this.$utils.openMessgeTip(message, '提示')
        }
      },
      handleNodeClick(data) {
        this.checkedDepartment = data;
      },
      checkDepartment() { //完成部门选择 点击OK 触发的事件
        //        if (this.checkedDepartment) {
        //          this.saveDepartment(this.checkedDepartment);
        //          this.$router.push({ path: "/home" })
        //        } else {
        //          this.$utils.openMessgeTip('请先选择一个部门!','提示')
        //        }
      },
      // toLogin(){
      //      alert(12121)
      // }
      toLogin(ev) {
        if (ev.keyCode == 13) {
          this.login()
        }
      },
    }
  }
</script>

<style lang="less">
  @import "./style.less";
</style>